export const SlGrid = defineComponent({
  name: 'SlGrid',
  setup() {
    return () => (
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="21"
        height="24"
        viewBox="0 0 24 24"
        stroke-width="2"
        stroke="currentColor"
        fill="none"
        stroke-linecap="round"
        stroke-linejoin="round"
      >
        <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
        <circle cx="5" cy="5" r="1"></circle>
        <circle cx="12" cy="5" r="1"></circle>
        <circle cx="19" cy="5" r="1"></circle>
        <circle cx="5" cy="12" r="1"></circle>
        <circle cx="12" cy="12" r="1"></circle>
        <circle cx="19" cy="12" r="1"></circle>
        <circle cx="5" cy="19" r="1"></circle>
        <circle cx="12" cy="19" r="1"></circle>
        <circle cx="19" cy="19" r="1"></circle>
      </svg>
    )
  }
})

export const SlArrowUpLeft = defineComponent({
  name: 'SlArrowUpLeft',
  setup() {
    return () => (
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="20"
        height="24"
        viewBox="0 0 24 24"
        stroke-width="2"
        stroke="#39B69A"
        fill="none"
        stroke-linecap="round"
        stroke-linejoin="round"
      >
        <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
        <line x1="7" y1="7" x2="17" y2="17"></line>
        <polyline points="16 7 7 7 7 16"></polyline>
      </svg>
    )
  }
})

export const SlArrowDownRight = defineComponent({
  name: 'SlArrowDownRight',
  setup() {
    return () => (
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="20"
        height="24"
        viewBox="0 0 24 24"
        stroke-width="2"
        stroke="#FA896B"
        fill="none"
        stroke-linecap="round"
        stroke-linejoin="round"
      >
        <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
        <line x1="7" y1="7" x2="17" y2="17"></line>
        <polyline points="17 8 17 17 8 17"></polyline>
      </svg>
    )
  }
})

export const SlCurrencyDollar = defineComponent({
  name: 'SlCurrencyDollar',
  setup() {
    return () => (
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="24"
        height="24"
        viewBox="0 0 24 24"
        stroke-width="2"
        stroke="currentColor"
        fill="none"
        stroke-linecap="round"
        stroke-linejoin="round"
      >
        <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
        <path d="M16.7 8a3 3 0 0 0 -2.7 -2h-4a3 3 0 0 0 0 6h4a3 3 0 0 1 0 6h-4a3 3 0 0 1 -2.7 -2"></path>
        <path d="M12 3v3m0 12v3"></path>
      </svg>
    )
  }
})

export const SlTrans = defineComponent({
  name: 'SlTrans',
  setup() {
    return () => (
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1.2em" height="1.2em">
        <path
          fill="currentColor"
          d="m18.5 10l4.4 11h-2.155l-1.201-3h-4.09l-1.199 3h-2.154L16.5 10h2zM10 2v2h6v2h-1.968a18.222 18.222 0 0 1-3.62 6.301a14.864 14.864 0 0 0 2.336 1.707l-.751 1.878A17.015 17.015 0 0 1 9 13.725a16.676 16.676 0 0 1-6.201 3.548l-.536-1.929a14.7 14.7 0 0 0 5.327-3.042A18.078 18.078 0 0 1 4.767 8h2.24A16.032 16.032 0 0 0 9 10.877a16.165 16.165 0 0 0 2.91-4.876L2 6V4h6V2h2zm7.5 10.885L16.253 16h2.492L17.5 12.885z"
        ></path>
      </svg>
    )
  }
})
